import { createRouter, createWebHistory } from 'vue-router'
import { createRouterGuards } from './routerGuards.js'
import Layout from '@/layout/index.vue'

// 静态路由--所有角色均可访问
export const constantRoutes = [
  {
    path: '/redirect/:path*',
    name: 'Redirect',
    component: () => import(/* webpackChunkName: "redirect" */ '@/layout/redirect/index.vue'),
    meta: {
      title: '刷新中...',
      hidden: true,
      keepAlive: false
    }
  },
  {
    path: '/404',
    name: '404',
    component: () => import(/* webpackChunkName: "404" */ '@/layout/404/index.vue'),
    meta: {
      title: '404',
      hidden: true,
      keepAlive: false
    }
  },
  {
    path: '/login',
    name: 'Login',
    component: () => import(/* webpackChunkName: "login" */ '@/views/login/index.vue')
  },
  {
    path: '/',
    name: 'Layout',
    redirect: '/dashboard',
    component: Layout,
    meta: {
      title: 'layout',
      hidden: false,
      keepAlive: false,
      icon: 'warning-circle'
    },
    children: [
      {
        path: 'dashboard',
        name: 'Dashboard',
        component: () => import(/* webpackChunckName: "dashboard" */ '@/views/dashboard/index.vue'),
        meta: {
          title: 'dashboard',
          hidden: false,
          keepAlive: false,
          icon: 'dashboard'
        }
      }
      // {
      //   path: 'page-detail',
      //   name: 'PageDetail',
      //   component: () => import(/* webpackChunkName: "AsyncPage" */ '@/views/keepPage/index.vue'),
      //   meta: {
      //     title: 'PageDetail-动态路由',
      //     hidden: false,
      //     keepAlive: true
      //   }
      // }
    ]
  }
]

// 动态路由
export const asyncRoutes = [
  {
    path: '/async',
    name: 'Async',
    redirect: '/async/page',
    component: Layout,
    meta: {
      title: 'parent-动态路由',
      alwaysShow: true,
      hidden: false,
      keepAlive: false,
      icon: 'sync'
    },
    children: [
      {
        path: 'page',
        name: 'Page',
        component: () => import(/* webpackChunkName: "AsyncPage" */ '@/views/asyncPage/index.vue'),
        meta: {
          title: 'component-动态路由',
          hidden: false,
          keepAlive: true
        }
      }
    ]
  },
  {
    path: '/:pathMatch(.*)*',
    name: 'NotFound',
    redirect: '/404',
    component: () => import(/* webpackChunkName: "404" */ '@/layout/404/index.vue'),
    meta: {
      title: '404',
      hidden: true,
      keepAlive: false
    }
  }
]

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes: constantRoutes
})

export function setupRouter (app) {
  app.use(router)
  // 创建路由守卫
  createRouterGuards(router)
}

export default router
